<template>
  <div class="otc">
    <div class="mr_mc">
      <div class="buy jueb" :class="{ active: mrmc }" @click="chooseMr">我要买入</div>
      <div class="buy juea" ref="sell" :class="{ active: !mrmc }" @click="chooseMr">我要卖出</div>
      <img @click="showTc" v-if="rightimg||otcorder" src="../../assets/list1.png" />
      <img @click="showTc" v-else src="../../assets/list.png" />
    </div>
    <div class="ecqh">
      <ul>
        <li
          v-for="(item,index) in bz"
          :key="index"
          :class="{active:(indexs==index)}"
          @click="chooseByts(index)"
        >{{item}}</li>
      </ul>
    </div>
    <div>
      <!--内容-->
      <div class="scroll-list-wrap" ref="wal">
        <div class="usdt" v-for="(item,index) in bz_list" :key="index">
          <div class="usdt_box">
            <!--第一行-->
            <div class="usdt_box_dyt">
              <div class="usdt_box_dyt_lt"></div>
              <div class="usdt_box_dyt_z">
                <p>{{item.title}}</p>
              </div>
              <div class="usdt_box_dyt_rt">
                <p>
                  交易笔数
                  <span>{{item.buynum}}</span>
                </p>
              </div>
            </div>
            <!--结束-->

            <!--第二行-->
            <div class="usdt_box_deh">
              <div class="usdt_box_deh_lt">
                <p style="line-height:2">
                  数量
                  <span>{{item.havemoney}}</span>
                  {{item.fieltype}}
                </p>
              </div>
              <div class="usdt_box_deh_rt">
                <p style="line-height:2">价格</p>
              </div>
            </div>
            <!--结束-->

            <!--第三行-->
            <div class="usdt_box_dsh">
              <div class="usdt_box_dsh_lt">
                <p>
                  限额
                  <span>{{item.mincny}}~{{item.maxcny}}</span> CNY
                </p>
              </div>
              <div class="usdt_box_dsh_rt">
                <p>
                  <span>{{item.price}}</span>CNY
                </p>
              </div>
            </div>
            <!--结束-->

            <!--第四行-->
            <div class="usdt_box_dsih">
              <div class="usdt_box_dsih_lt">
                <img v-if="item.paytype==1" src="../../assets/mm01.png" />
                <img v-if="item.paytype==2" src="../../assets/mm02.png" />
                <img v-if="item.paytype==3" src="../../assets/mm03.png" />
              </div>
              <div class="usdt_box_dsih_rt" v-if="item.type == '1'">
                <button class="mc" type="submit" @click="showbuy({id:item.id})">卖出</button>
              </div>
              <div class="usdt_box_dsih_rt" v-else>
                <button type="submit" @click="showbuy({id:item.id,ru:1})" class="wsmr">买入</button>
              </div>
            </div>
            <!--结束-->
          </div>
        </div>
        <p class="pullnew">{{pullnew}}</p>
      </div>
      <!--结束-->
    </div>
    <div class="wswc" v-if="show" @click="showTc"></div>
    <div class="m-megess" v-if="show">
      <router-link to="/business_s" style="text-decoration: none;">
        <div class="m-block" id="shsq">
          <img src="../../assets/merchant.png" alt />
          <span>商家申请</span>
        </div>
      </router-link>
      <router-link to="/otc_order" style="text-decoration: none;">
        <div class="m-block">
          <img src="../../assets/order1.png" alt v-if="otcorder" />
          <img src="../../assets/order.png" alt v-else />
          <span>OTC订单</span>
        </div>
      </router-link>
      <router-link to="/advertising" style="text-decoration: none;">
        <div class="m-block" id="ggrz01">
          <img src="../../assets/generalize.png" alt />
          <span>我的广告</span>
        </div>
      </router-link>
      <router-link to="/gbuy" style="text-decoration: none;">
        <div class="m-block" id="ggrz02">
          <img src="../../assets/buyorder.png" alt />
          <span>发布求购广告</span>
        </div>
      </router-link>
      <router-link to="/gsale" style="text-decoration: none;">
        <div class="m-block" id="ggrz03">
          <img src="../../assets/sellorder.png" alt />
          <span>发布出售广告</span>
        </div>
      </router-link>
      <router-link to="/leave" style="text-decoration: none;">
        <div style="margin-bottom:0" class="m-block" id="ggrz03">
          <img src="../../assets/leave1.png" v-if="rightimg" alt />
          <img src="../../assets/leave.png" alt v-else />
          <span>留言</span>
        </div>
      </router-link>
    </div>
    <div class="m-megesss" v-if="show1">
      <!--弹窗-->
      <div
        class="dongjie"
        style="width: 100%;height: 100%;background-color: #fff;border-top-left-radius:.2rem;border-top-right-radius:.2rem;z-index: 11111;position: fixed;left: 0;top:.5rem;"
      >
        <div class="top">
          <div class="top_lt">
            <p class="top_lt01">{{outtype}}{{fieltype}}</p>
            <p class="top_lt02">{{price}} CNY</p>
            <p class="top_lt03">限额{{quota}} CNY</p>
          </div>

          <div class="top_rt">
            <img src="../../assets/index01s.png" @click="cancel" />
          </div>
        </div>

        <div class="zfb">
          <img v-if="payt1==1" src="../../assets/mm01.png" />
          <img v-if="payt1==2" src="../../assets/mm02.png" />
          <img v-if="payt1==3" src="../../assets/mm03.png" />
          <p>{{payt}}</p>
        </div>

        <div class="xxl">
          <div class="xxl_lt">
            <img src="../../assets/index03s.png" />
          </div>

          <div class="xxl_rt">
            <div class="xxl_rt_top">
              <input
                class="input"
                @focus="isFocus(1)"
                v-model="numcny"
                type="number"
                :placeholder="max"
              />
              <p class="p1">CNY</p>
              <p class="p2" v-if="!mrmc" @click="allout">全部卖出</p>
              <p class="p2" v-else @click="allout">全部买入</p>
            </div>
            <div class="xxl_rt_top">
              <input
                class="input"
                v-model="numtype"
                @focus="isFocus"
                type="number"
                :placeholder="typemax"
              />
              <p class="p2" style="color: #21405B;">{{fieltype}}</p>
            </div>
          </div>
        </div>

        <div class="jymm">
          <div class="jymm_lt">
            <img src="../../assets/index04s.png" />
          </div>
          <div class="jymm_rt">
            <input type="password" v-model="password" placeholder="请输入您的交易密码" />
          </div>
        </div>

        <div class="an">
          <div class="an_lt" id="title">
            <p @click="cancel">{{djs}}s取消</p>
          </div>

          <div class="an_rt" ref="pushb">
            <p @click="oorder">下单</p>
          </div>
        </div>
      </div>
    </div>

    <div style="height:1.333333rem"></div>
    <Tabbar :idx="2" />
  </div>
</template>

<script>
// @ is an alias to /src
import Tabbar from "@/views/public/Tabbar.vue";
import { type } from "os";
import { setInterval, clearInterval, setTimeout } from "timers";

export default {
  name: "asset",
  components: {
    Tabbar
  },
  data() {
    return {
      bz: [],
      indexs: "",
      bz_list: [],
      type: "",
      ftype: "",
      mrmc: true,
      show: false,
      show1: false,
      wordnum: 0,
      page: 1,
      pullnew: "",
      limit: 10,
      options: {
        pullUpLoad: {
          threshold: 0,
          txt: {
            more: "上拉加载更多",
            noMore: ""
          }
        } // 配置上拉加载，若要关闭可直接 pullUpLoad：false
      },
      num: "",
      fieltype: "",
      quota: "",
      price: "",
      payt: "",
      payt1: "2",
      outtype: "",
      max: "",
      typemax: "",
      djs: "",
      time: "",
      id: "",
      password: "",
      numcny: "",
      isorder: false,
      numtype: "",
      isFocus1: true,
      rightimg: false,
      otcorder: false,
      clickorder:true
    };
  },
  created: function() {
    this.$axios.post("/index/otcexchange/isstatus").then(res => {
      console.log(res.data, " klkl");
      res.data.info > 0 ? (this.otcorder = true) : (this.otcorder = false);
    });
    this.$axios.post("/index/otcexchange/havemsg").then(res => {
      console.log(res.data, " klkl");
      res.data.info > 0 ? (this.rightimg = true) : (this.rightimg = false);
    });

      this.$axios.post("/index/otcexchange/getCurTypeBuy").then(res => {
        if (res.data.code == 0) {
          this.bz = res.data.info;
          this.indexs = Object.keys(res.data.info)[0];
          this.ftype = Object.keys(res.data.info)[0];
          this.$route.query.id == "sell" ? (this.mrmc = false) : "";
          if (sessionStorage.getItem("issuebuy")) {
            this.mrmc = !this.mrmc;
          }
          this.loadList();
        }
      });
  },
  methods: {
    chooseByts(index) {
      this.indexs = index;
      this.page = 1;
      this.loadList();
    },
    chooseMr() {
      this.mrmc = !this.mrmc;
      this.page = 1;
      this.loadList();
    },
    isFocus(s) {
      s == 1 ? (this.isFocus1 = true) : (this.isFocus1 = false);
    },
    showTc() {
      this.show = !this.show;
    },
    showbuy(s) {
       this.clickorder=true;
      this.$axios
        .post("/index/otcexchange/orderlog_detail", {
          id: s.id
        })
        .then(res => {
          if (res.data.code != 0) return;
          var s = res.data.info;
          this.fieltype = s.fieldtype;
          this.quota = s.mincny + "~" + s.maxcny;
          this.price = s.price;
          console.log(res.data.info, "看看");
          //   console.log(s.maxcny,Number(s.maxcny)/Number(s.price),'计算')
          if (!this.mrmc) {
            //maxcny/price
            this.max = "最大可卖" + Number(s.maxcny);
            this.typemax = "最大可卖" + Number(s.maxcny) / Number(s.price);
          } else {
            this.max = "最大可买" + Number(s.maxcny);
            this.typemax = "最大可买" + Number(s.maxcny) / Number(s.price);
          }

          this.id = s.id;
          this.payt1 = s.paytype;
          switch (s.paytype) {
            case "1":
              this.payt = "银行";
              break;
            case "2":
              this.payt = "支付宝";
              break;
            case "3":
              this.payt = "微信";
              break;
          }

          this.show1 = !this.show1;
          s.type == 1 ? (this.outtype = "出售") : (this.outtype = "购买");
          this.time60();

        });
    },
    guan() {
      this.show1 = false;
    },
    loadList(s) {
      if (this.mrmc) {
        this.type = 2;
      } else {
        this.type = 1;
      }
      this.ftype = this.indexs;
      this.$axios
        .post("/index/otcexchange/orderlist", {
          type: this.type,
          ftype: this.ftype,
          page: this.page,
          limit: 10
        })
        .then(res => {
          if (res.data.code == 0) {
            for (var i = 0; i < res.data.info.length; i++) {
              var trun = Number(res.data.info[i].havemoney);
              res.data.info[i].havemoney =
                parseInt(Number(trun) * 10000) / 10000;
            }
            //   ? (this.bz_list = this.bz_list.concat(res.data.info))
            //   : (this.bz_list = res.data.info);
          } else {
            // !s ? (this.bz_list = []) : "";
          }

          if (res.data.code == 0 && res.data.info.length > 0) {
            for (var i = 0; i < res.data.info.length; i++) {
              var trun = Number(res.data.info[i].havemoney);
              res.data.info[i].havemoney =
                parseInt(Number(trun) * 10000) / 10000;
            }
            // !s&&res.data.info.length<9?(this.bz_list=res.data.info,this.pullnew="已加载完所有数据")
            // :(this.bz_list=res.data.info,this.pullnew="下拉更新");
            // s&&res.data.info.length<9?(this.bz_list.concat(res.data.info),this.pullnew="已加载完所有数据")
            // :s?(this.bz_list.concat(res.data.info),this.pullnew="下拉更新"):'';
            var he = () => {
              for (var i = 0; i < res.data.info.length; i++) {
                this.bz_list.push(res.data.info[i]);
              }
            };
            !s && res.data.info.length < 9
              ? ((this.bz_list = res.data.info),
                (this.pullnew = "已加载完所有数据"))
              : !s && res.data.info.length > 9
              ? ((this.bz_list = res.data.info), (this.pullnew = "下拉更新"))
              : "";
            s && res.data.info.length < 9
              ? (he(), (this.pullnew = "已加载完所有数据"))
              : s
              ? (he(), (this.pullnew = "下拉更新"))
              : "";
          } else {
            !s
              ? ((this.pullnew = ""), (this.bz_list = []))
              : (this.pullnew = "已加载完所有数据");
          }
        });
    },

    //取消
    cancel() {
      this.show1 = !this.show1;
      this.password = "";
      this.numcny = "";
      this.numtype = "";
      clearInterval(this.time);
    },

    //60s
    time60() {
      this.djs = 60;
      var ts = this;
      this.time = setInterval(function() {
        var num1 = ts.djs;
        if (num1 <= 1) {
          ts.cancel();
          clearInterval(ts.time);
        } else {
          ts.djs = --num1;
        }
      }, 1000);
    },

    oorder() {

      if (!this.isorder) return;
      this.clickorder=false;
      this.isinputnum();
      this.$axios
        .post("/index/otcexchange/matchorder", {
          orderid: String(this.id),
          trad_password: String(this.password),
          num: String(this.numtype)
        })
        .then(res => {
          if (res.data.code == 0) {
            this.$createToast({
              txt: res.data.msg,
              type: "txt",
              time: 1000
            }).show();
            this.$axios.post("/index/otcexchange/getCurTypeBuy").then(res => {
              if (res.data.code == 0) {
                this.bz = res.data.info;
                this.indexs = Object.keys(res.data.info)[0];
                this.ftype = Object.keys(res.data.info)[0];
                this.loadList();
              }
            });
            setTimeout(() => {
              res.data.id
                ? this.$router.push({
                    path: "/otcdetails",
                    query: { id: res.data.id }
                  })
                : "";
            }, 1000);
            //console
            this.cancel();
          } else {
            this.$createToast({
              txt: res.data.msg,
              type: "txt",
              time: 1200
            }).show();
          };
          setTimeout(()=>{
            this.clickorder=true;
            this.isinputnum();
          },1200)
        })
        .catch(err=>{
          setTimeout(()=>{
              this.clickorder=true;
              this.isinputnum();
            },1200)
        })
    },
    isinputnum() {
      console.log(this.clickorder,'klkl')
      this.password && this.numcny&&this.clickorder
        ? ((this.isorder = true),
          (this.$refs.pushb.style.background = "#0053e6"))
        : ((this.isorder = false),
          (this.$refs.pushb.style.background = "#A4BFEF"));
    },
    allout() {
      this.max.split("卖")[1]
        ? (this.numcny = Number(this.max.split("卖")[1]))
        : (this.numcny = Number(this.max.split("买")[1]));
    },

    //send leave
    send() {
      console.log("send leave");
    },
    //下拉更新  vue下拉更新 下拉加载
    handleScroll() {
      var scrollTop =
        document.documentElement.scrollTop || document.body.scrollTop; //变量windowHeight是可视区的高度
      var windowHeight =
        document.documentElement.clientHeight || document.body.clientHeight; //变量scrollHeight是滚动条的总高度
      var scrollHeight =
        document.documentElement.scrollHeight || document.body.scrollHeight;
      if (scrollTop + windowHeight == scrollHeight) {
        //请求数据接口
        this.bz_list.length > 9 ? (this.page++, this.loadList(this.page)) : "";
        return false;
      }
    }
  },
  mounted() {
    window.addEventListener("scroll", this.handleScroll, true);
  },
  watch: {
    leaveinput(s) {
      this.wordnum = s.length;
    },
    password() {
      this.isinputnum();
    },
    numcny(s) {
      console.log(this.isFocus1, "cny");
      this.isinputnum();
      this.isFocus1 && s ? (this.numtype = Number(s) / Number(this.price)) : "";
      s == "" ? (this.numtype = "") : "";
    },
    numtype(s) {
      !this.isFocus1 && s ? (this.numcny = Number(s) * Number(this.price)) : "";
      s == "" ? (this.numcny = "") : "";
    }
  }
};
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped lang="less">
.pullnew {
  font-size: 0.4rem;
  padding: 0.6rem 0;
  text-align: center;
}
.f-flex {
  display: flex;
  display: -webkit-flex;
  align-items: center;
}

.otc {
  .mr_mc {
    display: flex;
    display: -webkit-flex;
    justify-content: center;
    font-size: 0.373333rem;
    padding-top: 0.4rem;
    position: relative;
    .buy {
      height: 1.04rem;
      width: 2.4rem;
      border: 1px solid #c6c6c6;
      text-align: center;
      line-height: 1.04rem;
      color: #999999;
    }
    .juea {
      border-bottom-right-radius: 5px;
      border-top-right-radius: 5px;
    }
    .jueb {
      border-bottom-left-radius: 5px;
      border-top-left-radius: 5px;
    }
    .buy.active {
      background: #f57d13;
      color: #fff;
    }
    img {
      width: 0.553333rem;
      height: 0.526667rem;
      z-index: 99;
      position: absolute;
      right: 0.3rem;
      top: 0.4rem;
    }
  }
  .ecqh {
    ul {
      display: flex;
      display: -webkit-flex;
      padding-left: 5%;
      margin-top: 1rem;
      margin-bottom: 0;
      border-bottom: 3px solid #e7e8ee;
      li {
        font-size: 0.4rem;
        margin-right: 0.4rem;
        color: #666;
        height: 0.8rem;
      }
      li.active {
        color: #f57d13;
        border-bottom: 3px solid #f57d13;
      }
    }
  }
  .usdt {
    width: 100%;
    padding: 0.5rem 0;
    border-top: 0.1rem solid #f2f2f2;
    border-bottom: 0.1rem solid #f2f2f2;
  }
  .usdt_box {
    width: 90%;
    margin: auto;
  }
  .usdt_box_dyt {
    width: 100%;
    overflow: hidden;
  }
  .usdt_box_dyt_lt,
  .usdt_box_dyt_z,
  .usdt_box_dyt_rt {
    float: left;
  }
  .usdt_box_dyt_lt {
    width: 0.7rem;
    height: 0.7rem;
    background: url("../../assets/tuto.png") no-repeat;
    background-size: 100% 100%;
    border-radius: 0.4rem;
  }
  .usdt_box_dyt_lt p {
    font-size: 0.35rem;
    color: #fff;
    text-align: center;
    line-height: 0.8rem;
  }
  .usdt_box_dyt_z {
    height: 0.8rem;
    margin-left: 0.1rem;
  }
  .usdt_box_dyt_z p {
    font-size: 0.35rem;
    color: #333;
    line-height: 0.8rem;
  }
  .usdt_box_dyt_rt {
    float: right;
    height: 0.8rem;
  }
  .usdt_box_dyt_rt p {
    font-size: 0.35rem;
    color: #999;
    line-height: 0.8rem;
  }

  .usdt_box_deh {
    width: 100%;
    overflow: hidden;
    margin-top: 0.2rem;
  }
  .usdt_box_deh_lt,
  .usdt_box_deh_rt {
    float: left;
  }
  .usdt_box_deh_lt p {
    font-size: 0.3rem;
    color: #999;
    line-height: 3;
  }
  .usdt_box_deh_rt {
    float: right;
    color: #999;
  }
  .usdt_box_dsh {
    width: 100%;
    overflow: hidden;
  }
  .usdt_box_dsh_lt,
  .usdt_box_dsh_rt {
    float: left;
  }
  .usdt_box_dsh_lt p {
    font-size: 0.3rem;
    color: #999;
    height: 0.4rem;
    line-height: 0.4rem;
  }
  .usdt_box_dsh_rt {
    float: right;
  }
  .usdt_box_dsh_rt p span {
    font-size: 0.4rem;
    color: #333;
    font-weight: bold;
  }
  .usdt_box_dsh_rt p {
    font-size: 0.3rem;
  }
  .usdt_box_dsih {
    width: 100%;
    overflow: hidden;
    margin-top: 0.2rem;
  }
  .usdt_box_dsih_lt,
  .usdt_box_dsih_rt {
    float: left;
  }
  .usdt_box_dsih_lt {
    overflow: hidden;
  }
  .usdt_box_dsih_lt img {
    float: left;
    width: 0.7rem;
    height: 0.7rem;
    display: block;
    margin-left: 0.1rem;
  }
  .usdt_box_dsih_rt {
    float: right;
  }
  .usdt_box_dsih_rt button {
    width: 1.5rem;
    font-size: 0.35rem;
    height: 0.8rem;
    line-height: 0.8rem;
    color: #fff;
    border-radius: 0.1rem;
    background: #03be87;
    border: 1px solid #03be87;
  }
  .usdt_box_dsih_rt .mc {
      background: #f57d13;
      border: 1px solid #f57d13;
  }
  .wswc {
    justify-content: center;
    align-items: center;
    height: 100%;
    width: 100%;
    top: 0;
    position: fixed;
    background: rgba(0, 0, 0, 0.6);
    left: 0;
    z-index: 1;
  }
  .m-megess {
    background: #fff;
    border-radius: 0.133333rem;
    position: absolute;
    right: 4%;
    top: 0.4rem;
    z-index: 9999;
    padding: 0.64rem 0.533333rem;
    font-size: 0.426667rem;
    .m-block {
      display: flex;
      display: -webkit-flex;
      align-items: center;
      line-height: 2;
      color: #333;
      margin-bottom: 0.453333rem;
      img {
        width: 0.55rem;
        display: block;
        margin-right: 0.1rem;
      }
    }
  }
  .m-megesss {
    background: #fff;
    border-radius: 0.133333rem;
    position: absolute;
    right: 4%;
    top: 0.4rem;
    z-index: 1;
    padding: 0.64rem 0.533333rem;
    font-size: 0.426667rem;

    .top {
      overflow: hidden;
      width: 90%;
      margin: auto;
      margin-top: 0.5rem;
    }
    .top_lt,
    .top_rt {
      float: left;
    }
    .top_lt01 {
      text-align: left;
      font-size: 0.5rem;
      color: #333;
      font-weight: bold;
    }
    .top_lt02 {
      text-align: left;
      font-size: 0.4rem;
      color: #333;
      font-weight: bold;
      margin-top: 0.1rem;
    }
    .top_lt03 {
      text-align: left;
      font-size: 0.3rem;
      color: #333;
      font-weight: bold;
      margin-top: 0.1rem;
    }
    .top_rt {
      float: right;
      width: 0.3rem;
      height: 0.3rem;
    }
    .top_rt img {
      width: 100%;
    }
    .zfb {
      width: 90%;
      margin: auto;
      overflow: hidden;
      margin-top: 1.5rem;
    }
    .zfb img,
    .zfb p {
      float: left;
    }
    .zfb img {
      width: 0.4rem;
      display: block;
    }
    .zfb p {
      font-size: 0.3rem;
      color: #333;
      font-weight: bold;
      margin-left: 0.1rem;
      margin-top: 0.03rem;
    }
    .xxl {
      width: 90%;
      margin: auto;
      margin-top: 1rem;
      height: 2rem;
      border: 1px solid #dcdcdc;
      overflow: hidden;
    }
    .xxl_lt,
    .xxl_rt {
      float: left;
    }
    .xxl_lt {
      width: 2%;
      height: 2rem;
      margin-left: 1%;
      margin-right: 1%;
    }
    .xxl_lt img {
      width: 100%;
      display: block;
      margin-top: 0.7rem;
    }
    .xxl_rt {
      width: 96%;
    }
    .xxl_rt_top {
      width: 96%;
      height: 1rem;
      margin: auto;
      border-bottom: 1px solid #dcdcdc;
      overflow: hidden;
    }
    .input,
    .p1,
    .p2 {
      float: left;
    }
    .xxl_rt_top input {
      width: 68%;
      height: 1rem;
      border: 0;
      font-size: 0.3rem;
    }
    .xxl_rt_top .p1 {
      font-size: 0.35rem;
      color: #21405b;
      font-weight: bold;
      line-height: 0.4rem;
      border-right: 2px solid #dcdcdc;
      margin-top: 0.3rem;
      padding-right: 0.2rem;
    }
    .xxl_rt_top .p2 {
      font-size: 0.35rem;
      font-weight: bold;
      color: #f57d13;
      line-height: 1rem;
      float: right;
    }
    .jymm {
      width: 90%;
      height: 1rem;
      margin: auto;
      margin-top: 0.5rem;
      overflow: hidden;
      border: 1px solid #dcdcdc;
    }
    .jymm_lt,
    .jymm_rt {
      float: left;
    }
    .jymm_lt {
      width: 3%;
      height: 1rem;
      margin-left: 1%;
      margin-right: 3%;
    }
    .jymm_lt img {
      width: 100%;
      display: block;
      margin-top: 0.3rem;
    }
    .jymm_rt {
      width: 93%;
    }
    .jymm_rt input {
      width: 100%;
      height: 1rem;
      line-height: 1rem;
      font-size: 0.3rem;
      border: 0;
    }
    .an {
      width: 90%;
      margin: auto;
      margin-top: 1rem;
      overflow: hidden;
    }
    .an_lt,
    .an_rt {
      float: left;
    }
    .an_lt {
      width: 48%;
      height: 1rem;
      background: #f6f6f6;
      font-size: 0.35rem;
      color: #1368ff;
      text-align: center;
      line-height: 1rem;
    }
    .an_rt {
      width: 48%;
      height: 1rem;
      background: #a4bfef;
      margin-left: 4%;
    }
    .an_rt p {
      font-size: 0.35rem;
      color: #ffffff;
      text-align: center;
      line-height: 1rem;
    }
  }
}
.otc .usdt_box_dsih_rt button:active{
  background: #008e64;
  border: 1px solid #008e64;
}
.otc .usdt_box_dsih_rt .mc:active{
    background: #d60000;
    border: 1px solid #d60000;
}
</style>

